/*** Strallax v1.0 animations ***/

/*==========================================================================
  FEATURES
  ========================================================================== */
  .line-wrap {-webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s;}
  
/*==========================================================================
  SOCIAL	
  ========================================================================== */
  #social a {-webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s;}
  
/*==========================================================================
  PORTFOLIO
  ========================================================================== */
  .portfolio-wrap .scroller-wrap .scroller{-webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s;}
  .entry .hover {-webkit-transition: all .3s ease;-moz-transition: all .3s ease;transition: all .3s ease;}
  .entry:hover .icon {transform: translate(350px,0);-webkit-transform: translate(350px,0); /** Chrome & Safari **/-o-transform: translate(350px,0); /** Opera **/-moz-transform: translate(350px,0); /** Firefox **/}
  .entry:hover img{-webkit-transform: scale(1.2) rotate(4deg);-moz-transform: scale(1.2) rotate(4deg);-ms-transform: scale(1.2) rotate(4deg);transform: scale(1.2) rotate(4deg);}
  .entry img { -webkit-transition: all .3s ease;-moz-transition: all .3s ease;transition: all .3s ease;}
	
/*==========================================================================
  PRICING
  ========================================================================== */
  .pricing-wrap .btn {-webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s;}
  /*
  .pricing-wrap .package {
	transform-style: preserve-3d;
	transition: all 1.0s linear;
  }  
  
  .pricing-wrap:hover .package {
	transform: rotateY(180deg) !important;
	box-shadow: -5px 5px 5px #aaa;
  }
  */  
  
/*==========================================================================
  TEAM
  ========================================================================== */
  #team .profile-wrap {-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
  
/*==========================================================================
  TWITTER
  ========================================================================== */
	#twitter:hover .twitter-bird { 
		-webkit-animation: fly .4s steps(6) infinite;
		   -moz-animation: fly .4s steps(6) infinite;
			-ms-animation: fly .4s steps(6) infinite;
			 -o-animation: fly .4s steps(6) infinite;
				animation: fly .4s steps(6) infinite;
	}

	@-webkit-keyframes fly {
	   from { background-position:    0px; }
		 to { background-position: -1486.5px; }
	}

	@-moz-keyframes fly {
	   from { background-position:    0px; }
		 to { background-position: -1486.5px; }
	}

	@-ms-keyframes fly {
	   from { background-position:    0px; }
		 to { background-position: -1486.5px; }
	}

	@-o-keyframes fly {
	   from { background-position:    0px; }
		 to { background-position: -1486.5px; }
	}

	@keyframes fly {
	   from { background-position:    0px; }
		 to { background-position: -1486.5px; }
	}
  
  /*==========================================================================
  ICONS
  ========================================================================== */
  /*
 	.sm-icon, .md-icon , #contact-alt button{  
		-webkit-transition: background-color 200ms linear;
		-moz-transition: background-color 200ms linear;
		-o-transition: background-color 200ms linear;
		-ms-transition: background-color 200ms linear;
		transition: background-color 200ms linear;	
		-webkit-transition: border-color 200ms linear;
		-moz-transition: border-color 200ms linear;
		-o-transition: border-color 200ms linear;
		-ms-transition: border-color 200ms linear;
		transition: border-color 200ms linear;
	}
*/
	/* Effect 5 */
	.animate.effect-5d .md-icon {
		-webkit-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
		-moz-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
		transition: background 0.3s, color 0.3s, box-shadow 0.3s;
	}

	.animate.effect-5d:hover .md-icon {
		box-shadow: 0 0 0 8px rgba(255,255,255,0.2) !important;
	}

	.animate.effect-5d:hover > .md-wrap > .md-icon i:before {
		-webkit-animation: toTopFromBottom 0.3s forwards;
		-moz-animation: toTopFromBottom 0.3s forwards;
		animation: toTopFromBottom 0.3s forwards;
	}

	@-webkit-keyframes toTopFromBottom {
		49% {
			-webkit-transform: translateY(-100%);
		}
		50% {
			opacity: 0;
			-webkit-transform: translateY(100%);
		}
		51% {
			opacity: 1;
		}
	}
	@-moz-keyframes toTopFromBottom {
		49% {
			-moz-transform: translateY(-100%);
		}
		50% {
			opacity: 0;
			-moz-transform: translateY(100%);
		}
		51% {
			opacity: 1;
		}
	}
	@keyframes toTopFromBottom {
		49% {
			transform: translateY(-100%);
		}
		50% {
			opacity: 0;
			transform: translateY(100%);
		}
		51% {
			opacity: 1;
		}
	}

	.animate.effect-3 .md-icon, .animate.effect-3 .md-icon i {
		-webkit-transition: background 0.2s;
		-moz-transition: background 0.2s;
		transition: background 0.2s;
	}

	.animate.effect-3 .md-icon:after {
		top: -2px;
		left: -2px;
		padding: 2px;
		z-index: -1;
		background: #fff;
		-webkit-transition: -webkit-transform 0.2s, opacity 0.3s;
		-moz-transition: -moz-transform 0.2s, opacity 0.3s;
		transition: transform 0.2s, opacity 0.3s;
		
		-webkit-transform: scale(1.3);
		-moz-transform: scale(1.3);
		-ms-transform: scale(1.3);
		transform: scale(1.3);
		opacity: 0;
	}

	.animate.effect-3:hover .md-icon {
		box-shadow: 0 0 0 8px rgba(255,255,255,0.2) !important;
		
	}